Date pickers 日期選擇器

1 Docked date picker 停靠式日期選擇器 2 Modal date picker 模態日期選擇器 3 Modal date input 模態日期輸入框
M2
M3

Docked date picker  停靠式日期選擇器

1 Outlined text field 2 Menu button: Month selection 3 Menu button: Year selection 4 Icon button 5 Weekdays label text 6 Unselected date 7 Today's date 8 Outside month date 9 Text buttons 10 Container
1 Outlined text field 2 Menu button: Month selection (pressed) 3 Menu button: Year selection (disabled)4 Header 5 Menu 6 Selected list item 7 Unselected menu list item 8 Container

Docked date picker measurements 停靠式日期選擇器尺寸規格

Element  元素Atribute  屬性（注：原詞“Atribute”拼寫有誤，正確為“Attribute” ）Value  值
Container  容器Width  寬度328d
Height  高度428dp
Header  標題Height  高度64dp
Date container  日期容器Width  寬度40dp
Height  高度40dp
Date state layer  日期狀態層Width  寬度40dp
Height  高度40dp
Menu button container  選單按鈕容器Height  高度40dp
Left padding  左內邊距8dp
Right padding  右內邊距4dp
Padding between elements  元素之間的8dp
Menu: List item  選單：列表項Item height  項高度48dp
Menu: List item (selected)選單：列表項（已選中）Icon size  圖示大小24dp

Docked date picker configurations停靠式日期選擇器配置

1 Dayselection 2 Month selection 3 Year selection

Modal date picker  模態日期選擇器

1 Headline 2 Supporting text 3 Header 4 Container 5 Icon button 6 Icon buttons 7 Weekdays 8 Today's date 9 Unselected date 10 Text buttons 11 Selected date 12 Menu button 13 Divider
1 Headline 2 Supporting text 3 Header 4 Container 5 Icon button 6 Unselected year 7 Selected year8Text buttons 9Divider 10Menu button
1 Headline 2 Supporting text 3 Icon button 4 Header 5 Text button 6 Icon button 7 Weekdays label text 8 Container 9 Unselected date 10 Today's date 11 In range active indicator 12 In range date 13 Month subhead 14 Selected date 15 Divider

Modal date picker measurements模態日期選擇器尺寸

Element  元素Attribute  屬性Value  值
Container  容器Width  寬度328dp
Height  高度512dp
Header container  頭部容器Width  寬度328dp
Height  高度120dp
Range selection - Header container範圍選擇 - 頭部容器Width  寬度Dynamic  動態的
Height  高度128dp
Date container  日期容器Width  寬度40dp
Height  高度40dp
Date state layer  日期狀態層Width  寬度40dp
Height  高度40dp
Year selection - Year container年份選擇 - 年份容器Width  寬度72dp
Height  高度36dp
Year selection - State layer年份選擇 - 狀態層Width  寬度72dp
Height  高度36dp
Range selection - Active indicator範圍選擇 - 活動指示器Width  寬度Dynamic  動態的
Height  高度40dp

Modal date picker configurations模態日期選擇器配置

1 單日期選擇 2 日期範圍選擇 3 年份選擇

Modal date input  模態日期輸入框

1 Headline 2 Supporting text 3 Header 4 Container 5 Icon button 6 Outlined text field 7 Text buttons 8 Divider

Modal date input measurements模態日期輸入測量值

Element  元素Attribute  屬性Value  值
Container  容器Width  寬度328dp
Height  高度512dp
Header container  頭部容器Width  寬度328dp
Height  高度120dp

Modal date input configurations模態日期輸入配置

1 Default (enabled) 2 Disabled 3 Hovered 4 Focused 5 Dragged